<template>
    <div>
        <el-descriptions title="发票信息"></el-descriptions>
        <el-form ref="form" :model="param" label-width="140px">
            <el-row>

                <el-col :span="5">
                    <el-form-item label="客户">
                        <el-input v-model="param.customerId" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="5">
                    <el-form-item label="纳税人识别号">
                        <el-input v-model="param.shibiehao" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="5">
                    <el-form-item label="发票类型">
                        <el-select v-model="param.fapiaoStatus" clearable placeholder="请选择" style="width: 170px;">
                            <el-option label="普通发票" value="0"></el-option>
                            <el-option label="增值税发票" value="1"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>

                <el-col :span="5">
                    <el-form-item label="开户行">
                        <el-input v-model="param.kaihuhang" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>


                <el-col :span="5">
                    <el-form-item label="联系方式">
                        <el-input v-model="param.tel" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="5">
                    <el-form-item label="备注">
                        <el-input v-model="param.remark" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="5">
                    <el-form-item label="开票金额">
                        <el-input v-model="param.kaipiaoMoney" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="5">
                    <el-form-item label="税">
                        <el-input v-model="param.shui" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="5">
                    <el-form-item label="卡号">
                        <el-input v-model="param.kahao" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="5">
                    <el-form-item label="对账单">
                        <el-input v-model="param.duiMoneyId" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="5">
                    <el-form-item label="应付单">
                        <el-input v-model="param.yingfuMoneyId" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="5">
                    <el-form-item label="相关订单">
                        <el-input v-model="param.dingdanId" style="width: 170px;"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>

        <!-- 这里是按钮的部分 -->
        <div class="fixed-buttons">
            <button class="btn-cancel" @click="cancel">取消</button>
            <button class="btn-save" @click="saveData">开票</button>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            param: {},
        }
    },

    methods: {
        cancel() {
            this.$router.push("/fapiao");
            window.location.reload();
        },

        saveData() {
            this.$axios.post('api/fapiao/add', this.param)
                .then(response => {
                    if (response.data.code == 200) {
                        this.$router.push("/fapiao");
                        window.location.reload();
                    }
                })
        }
    },

    created() {

    }
}
</script>

<style scoped>
/* 按钮样式 */
.fixed-buttons {
    position: fixed;
    right: 20px;
    bottom: 20px;
    display: flex;
    gap: 10px;
    /* 设置按钮之间的间距 */
    z-index: 1000;
    /* 确保按钮在最上面 */
}

.btn-cancel,
.btn-save {
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    border: none;
    border-radius: 5px;
    background-color: #409EFF;
    /* 按钮背景色 */
    color: white;
}
</style>